<template>
  <div class="PhoneInp">
    <input type="number" placeholder="输入密码" :value="phone" @input="handlePhone" password>
    <div class="nextbtn btn btn-red"  @click="next">
      立即登录
    </div>

  </div>
</template>

<script>
export default {


  data() {
    return {
      isTure:false,
      phone:'',
    }
  },
  methods: {
    handlePhone(e){
      this.phone = e.detail.value
      this.isTure = this.$rex.phone(this.phone)
    },
    next(){
      if (this.isTure) {
        this.$emit('next',this.phone)
      }

    }
  },
}
</script>

<style lang="scss">
.PhoneInp{
  height: 100vh;
  background-color: #151515;
  padding: 40rpx;
  // padding-top: 40rpx;
  input{
    border-bottom: 2rpx solid #2a2a2a;
    // margin: 0 40rpx;
    height: 72rpx;
    padding-left: 10rpx;
  }
  .nextbtn{
    margin-top: 60rpx;
    height: 72rpx;
    border-radius: 36rpx;
  }
}
</style>